<template>
	<div class="experience-main">
		<experience-editor @codeChange="codeChange"/>
		<!-- <iframe 
      :src="codePath" 
      unselectable="on" 
      frameborder="0" 
      scrolling="no" 
      style="width: calc(100% - 500px);
      height:100%;" 
      ref="myIframe" 
      id="codeIframe" 
      allowfullscreen
    >
    </iframe> -->
	</div>
</template>
 
<script setup>
	// import { mapState } from 'vuex';
	import ExperienceEditor from './experience-editor.vue';
	// export default {
	// 	name:'sample',
	// 	watch: {
	// 		// // 因为需求是多个html代码展示效果，所以嵌套的iframe地址是动态的
	// 		// codePath(newValue,oldValue) {
	// 		// 	if(newValue !== 'about:blank' && newValue !== 'about:blank#'){
	// 		// 		let code = this.readFile(newValue);
	// 		// 		this.writeCode(code);
	// 		// 	}
	// 		// }
	// 	},
	// 	components: {
	// 		ExperienceEditor
  // 		},
	// 	computed: {
	// 		// ...mapState(['codePath'])
	// 	},
	// 	methods: {
	// 		// // 利用创建iframe空页面然后写入代码
	// 		// codeChange(val){
	// 		// 	if(this.codePath !== 'about:blank'){
	// 		// 		this.$store.commit("updateCodePath", 'about:blank');
	// 		// 	} else{
	// 		// 		this.$store.commit("updateCodePath", 'about:blank#');
	// 		// 	}
	// 		// 	this.writeCode(val);
	// 		// },
	// 		// // 向iframe空页面写代码
	// 		// writeCode(code){
	// 		// 	const iframe = document.querySelector('#codeIframe');
	// 		// 	iframe.onload = function(){
	// 		// 		iframe.contentWindow.document.open();
	// 		// 		iframe.contentWindow.document.write(code);
	// 		// 		iframe.contentWindow.document.close();
	// 		// 	};
	// 		// },
	// 		// // 读取文件内代码内容转化成字符串
	// 		// readFile(filePath) {
	// 		// 	let xhr = null
	// 		// 	if (window.XMLHttpRequest) {
	// 		// 		xhr = new XMLHttpRequest()
	// 		// 	} else {
	// 		// 		xhr = new ActiveXObject('Microsoft.XMLHTTP')
	// 		// 	}
	// 		// 	const okStatus = document.location.protocol === 'file' ? 0 : 200
	// 		// 	xhr.open('GET', filePath, false)
	// 		// 	xhr.overrideMimeType('text/html;charset=utf-8')
	// 		// 	xhr.send(null)
	// 		// 	return xhr.status === okStatus ? xhr.responseText : null
	// 		// },
	// 	},
	
	// }
</script>